import { trpcPureClient } from '@/utils/api';
import { Button } from '../ui/Button';
import { Copy, Trash2 } from 'lucide-react';
import { useMutation } from '@tanstack/react-query';
import copy from 'copy-to-clipboard';
import { toast } from 'sonner';

export function DeleteFile({
  fileId,
  onDeleteSuccess,
}: {
  fileId: string;
  onDeleteSuccess: (fileId: string) => void;
}) {
  const { mutateAsync: removeFile, isPending } = useMutation({
    mutationFn: trpcPureClient.file.deleteFile.mutate,
    onSuccess() {
      onDeleteSuccess(fileId);
      toast('Deleted Success!');
    },
  });

  const handleRemoveFile = async () => {
    return removeFile(fileId);
  };

  return (
    <Button variant="ghost" onClick={handleRemoveFile} disabled={isPending}>
      <Trash2 />
    </Button>
  );
}

export function CopyUrl({ id }: { id: string }) {
  const handleCopy = () => {
    copy(`${location.host}/api/image/${id}`);
    toast('Url Copied!');
  };

  return (
    <Button variant="ghost" onClick={handleCopy}>
      <Copy />
    </Button>
  );
}
